<template>
    <el-table size="small" ref="table_s_exp" :height="activeHeight1" style="width: 100%" :header-cell-style="{
        background: '#fafbfc',
        color: '#333333',
    }" :data="primitivesData">
        <el-table-column prop="shape_index" width="80" label="序号" align="center" />
        <el-table-column show-overflow-tooltip label="基本体" prop="shape_type"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数A" prop="parameter_a"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数B" prop="parameter_b"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数C" prop="parameter_c"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数D" prop="parameter_d"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数E" prop="parameter_e"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数F" prop="parameter_f"></el-table-column>
        <el-table-column show-overflow-tooltip label="参数G" prop="parameter_g"></el-table-column>
        <el-table-column width="200" label="操作">
            <template #default="scope">
                <el-tooltip effect="dark" content="编辑" placement="top">
                    <el-button @click="editRow(scope.$index, scope.row)" size="small" type="primary" :icon="Edit"
                        circle>
                    </el-button>
                </el-tooltip>

                <el-tooltip effect="dark" content="复制" placement="top" :open-delay="800">
                    <el-button @click="copyRow(scope.row)" size="small" type="info" :icon="DocumentCopy" circle />
                </el-tooltip>

                <el-tooltip effect="dark" content="上移" placement="top" :open-delay="800">
                    <el-button @click="moveUpRow(scope.$index, primitivesData)" size="small" type="success" :icon="Top"
                        circle />
                </el-tooltip>

                <el-tooltip effect="dark" content="下移" placement="top" :open-delay="800">
                    <el-button @click="moveDownRow(scope.$index, primitivesData)" size="small" type="warning"
                        :icon="Bottom" circle />
                </el-tooltip>

                <el-popconfirm placement="left" @confirm="deleteRow(scope.$index, primitivesData)" title="确定要删除?">
                    <template #reference>
                        <el-button size="small" type="danger" :icon="Delete" circle />
                    </template>
                </el-popconfirm>

                <!-- <span style="color: #1890ff; margin: 1em;font-size:12px;cursor: pointer;" size="small" @click="handleEdit(scope.$index, scope.row)">编辑</span>
                   <el-popconfirm title="确定要删除了?" @confirm="confirmEvent(scope.$index, scope.row)">
                     <template #reference>
                       <span style="color: #189eff;;font-size:12px;cursor: pointer;">删除</span>
                     </template>
                   </el-popconfirm> -->
            </template>
        </el-table-column>
    </el-table>
</template>

<script setup>
    import { ref, reactive, onMounted, watch, nextTick } from "vue";
    import {
        Download,
        Upload,
        Calendar,
        Check,
        Delete,
        Edit,
        Message,
        Search,
        Star,
        DocumentCopy,
        Top,
        Bottom,
        Guide,
        Coordinate,
    } from "@element-plus/icons-vue";

    let props = defineProps(['activeHeight1','primitivesData']);
 let emit = defineEmits(['editRow','copyRow','moveUpRow','moveDownRow','deleteRow'])
  let activeHeight1 = ref(0)
  let primitivesData = ref([])
  watch(props,()=>{
    activeHeight1.value = props.activeHeight1
    primitivesData.value = props.primitivesData
},{deep:true})


let editRow = (index, row) => {
    emit('editRow',index, row)
}

let copyRow = (row) => {
    emit('copyRow',row)
}

let moveUpRow = (index, data) => {
    emit('moveUpRow',index, data)
}


let moveDownRow = (index, data) => {
    emit('moveDownRow',index, data)
}


let deleteRow = (index, data) => {
    emit('deleteRow',index, data)
}


</script>

<style></style>